import { Component } from '@angular/core';
import { NzBreadCrumbModule } from 'ng-zorro-antd/breadcrumb';
import { NzIconModule } from 'ng-zorro-antd/icon';

@Component({
  selector: 'app-breadcrumb-split',
  standalone: true,
  imports: [NzBreadCrumbModule, NzIconModule],
  template: `
    <div class="demo">
      <nz-breadcrumb nzSeparator=" > ">
        <nz-breadcrumb-item><a> Home </a></nz-breadcrumb-item>
        <nz-breadcrumb-item>
          <a> Application List </a>
        </nz-breadcrumb-item>
        <nz-breadcrumb-item>An Application</nz-breadcrumb-item>
      </nz-breadcrumb>

      <nz-breadcrumb [nzSeparator]="breadcrumbSplit">
        <nz-breadcrumb-item><a> Home </a></nz-breadcrumb-item>
        <nz-breadcrumb-item>
          <a> Application List </a>
        </nz-breadcrumb-item>
        <nz-breadcrumb-item>An Application</nz-breadcrumb-item>
      </nz-breadcrumb>
      <ng-template #breadcrumbSplit>
        <span nz-icon nzType="arrow-right"></span>
      </ng-template>
    </div>
  `,
  styles: ``,
})
export class BreadcrumbSplitComponent {}
